// 获取元素
// 分析：
// 1、鼠标进入显示图片，
// 鼠标进入li，让当前li变成800，其他的li变成100
//鼠标离开 让所有的li变成240
let img = document.querySelectorAll(`#box li`);
let all = document.querySelectorAll(`div li`);

function change(i) {
  if (i == 1) {
    for (let i = 0; i < all.length; i++) {
      all[i].style.width = `100px`;
    }
  } if (i == 0) {
    for (let i = 0; i < all.length; i++) {
      all[i].style.width = `325.2px`;
    }
  }
}

for (let i = 0; i < img.length; i++) {
  img[i].addEventListener(`mouseenter`, function () {
    change(1);
    this.style.width = `1226px`;
  })
  img[i].addEventListener(`mouseleave`, function () {
    change(0);
  })
}




